
    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Git中的"钩子"（hooks）指的是什么，它们的作用是什么？ - 学习卡片</title>
      <style>
        body { font-family: sans-serif; background-color: #f0f8ff; color: #333; display: flex; flex-direction: column; align-items: center; padding: 50px 20px; }
        .header h1 { font-size: 32px; }
        .grid-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; width: 100%; max-width: 1200px; }
        .card-container { perspective: 1200px; cursor: pointer; height: 250px; }
        .card { width: 100%; height: 100%; position: relative; transform-style: preserve-3d; transition: transform 0.7s; border-radius: 16px; box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
        .card-container.flipped .card { transform: rotateY(180deg); }
        .card-face { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; display: flex; flex-direction: column; box-sizing: border-box; border-radius: 16px; background-color: #fff; padding: 24px; }
        .card-back { background-color: #f0fff4; transform: rotateY(180deg); justify-content: space-between; }
        .card-category { font-size: 14px; color: #0052d9; margin-bottom: 8px; font-weight: 500; }
        .card-question { font-size: 20px; font-weight: 500; flex-grow: 1; display: flex; align-items: center; justify-content: center; text-align: center; }
        .card-answer-wrapper { flex-grow: 1; overflow-y: auto; }
        .card-answer { font-size: 15px; line-height: 1.7; }
        .card-footer { font-size: 13px; color: #8a919f; border-top: 1px solid #f0f0f0; padding-top: 16px; margin-top: 16px; }
        .card-source { font-size: 13px; color: #8a919f; border-top: 1px solid #f0f0f0; padding-top: 12px; margin-top: 12px; }
      </style>
    </head>
    <body>
      <div class="header">
        <h1>Git中的"钩子"（hooks）指的是什么，它们的作用是什么？ - 学习卡片</h1>
      </div>
      <div class="grid-container">
        
    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">理论</div>
          <div class="card-question">Git 钩子（hooks）是什么，它的主要作用是什么？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">理论</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">Git 钩子是一种机制，它允许在 Git 执行特定操作（如提交或推送）时自动执行自定义的可执行脚本。这些脚本可用于执行各种自动化任务，如代码检查、自动测试、构建过程和发送通知等。</div>
          </div>
          <div class="card-source">来源: Git 钩子的基本概念</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">技术</div>
          <div class="card-question">Git 钩子脚本通常存放在仓库的哪个具体目录下？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">技术</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">Git 钩子脚本通常位于 Git 仓库的 `.git/hooks` 目录下。</div>
          </div>
          <div class="card-source">来源: Git 钩子的基本概念</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">机制</div>
          <div class="card-question">`pre-commit` 钩子的触发时机是什么？它通常被用于哪些场景？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">机制</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">`pre-commit` 钩子在提交操作开始之前执行。它通常用于代码检查、自动格式化或运行测试，目的是确保提交的代码符合规范，防止不符合标准的代码被提交。</div>
          </div>
          <div class="card-source">来源: 常见的 Git 钩子及其作用</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">模式</div>
          <div class="card-question">如何使用 Git 钩子来强制团队遵循特定的提交信息（commit message）格式规范？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">模式</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">可以使用 `commit-msg` 钩子。这个钩子在提交信息编辑完成之后、提交操作完成之前执行，专门用于验证提交消息的格式是否符合预设的规则。</div>
          </div>
          <div class="card-source">来源: 常见的 Git 钩子及其作用</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">机制</div>
          <div class="card-question">在代码提交（commit）操作完成后，哪个钩子会被触发？它适合执行哪些类型的任务？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">机制</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">`post-commit` 钩子会在提交操作完成之后执行。它适合用于执行一些后处理任务，例如发送通知给相关系统或触发 CI/CD 流水线。</div>
          </div>
          <div class="card-source">来源: 常见的 Git 钩子及其作用</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">特性</div>
          <div class="card-question">请说明 `pre-push` 和 `pre-receive` 钩子的主要区别。</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">特性</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">主要区别在于执行环境和时机不同。`pre-push` 是客户端钩子，在执行推送操作到远程仓库之前在本地执行；而 `pre-receive` 是服务器端钩子，在服务器接收到推送内容之前执行，用于决定是否允许此次推送。</div>
          </div>
          <div class="card-source">来源: 常见的 Git 钩子及其作用</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">机制</div>
          <div class="card-question">如果希望在服务器成功接收到推送后自动部署代码，应该使用哪个服务器端钩子？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">机制</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">应该使用 `post-receive` 钩子。它在服务器端成功接收到推送并完成后执行，非常适合用于在服务器上自动部署代码、更新网站或执行其他自动化任务。</div>
          </div>
          <div class="card-source">来源: 常见的 Git 钩子及其作用</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">技术</div>
          <div class="card-question">在 Linux 或 macOS 系统上，要使一个钩子脚本能够被 Git 执行，必须对其文件进行什么关键设置？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">技术</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">必须确保钩子脚本具有可执行权限。可以使用 `chmod +x <hook-file>` 命令来为脚本文件设置可执行权限。</div>
          </div>
          <div class="card-source">来源: 使用钩子的注意事项</div>
        </div>
      </div>
    </div>

    <div class="card-container" onclick="this.classList.toggle('flipped');">
      <div class="card">
        <div class="card-face card-front">
          <div class="card-category">模式</div>
          <div class="card-question">由于 `.git/hooks` 目录本身不被 Git 版本控制，文档中推荐了什么方法来在团队中共享钩子脚本？</div>
          <div class="card-footer">点击卡片查看答案</div>
        </div>
        <div class="card-face card-back">
          <div class="card-category">模式</div>
          <div class="card-answer-wrapper">
            <div class="card-answer">文档推荐的方法是：将钩子脚本存放在项目代码库中（使其被版本控制），然后在每个团队成员的本地仓库的 `.git/hooks` 目录下创建一个指向该脚本的符号链接（symlink）。</div>
          </div>
          <div class="card-source">来源: 使用钩子的注意事项</div>
        </div>
      </div>
    </div>

      </div>
    </body>
    </html>
